<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
		
			div {
				width: 100px;
				height: 50px;
				background: #f00;
								
			/* 连写 */
			/* animation: sport 3s linear 1s 4 normal; */
			
			/*连写简写 */
			animation: sport 3s;
			}
			
			@keyframes sport {
				from {
					margin-left: 0px;
				}
		
				to {
					margin-left: 500px;
				}
			}			
		</style>
	</head>
	<body>
		<!-- 
		 动画模块连写格式
		 animation:动画名称 动画时长 动画运动速度 延迟时间 执行次数 往返动画;
		 
		 
		 动画模块连写格式的简写
		 animation:动画名称 动画时长;
		 
		 -->
		<div></div> 
		 
	</body>
</html>
